<!-- 病例列表记录 -->
<template>
  <div>
    <div class="text-lg font-semibold m-1">病例列表</div>
    <el-table :data="state.dataList" v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
      :header-cell-style="tableStyle.headerCellStyle" @sort-change="sortChangeHandle">
      <el-table-column prop="caseId" label="病例id" show-overflow-tooltip />
      <el-table-column prop="chiefComplaint" label="主诉" show-overflow-tooltip />
      <el-table-column prop="presentIllness" label="现病史" show-overflow-tooltip />
      <el-table-column prop="pastIllness" label="既往病史" show-overflow-tooltip />
      <el-table-column prop="doctorAdvice" label="医嘱内容" show-overflow-tooltip />
      <el-table-column prop="patientSource" label="患者类型名称" show-overflow-tooltip />
      <el-table-column label="操作" width="150">
        <template #default="scope">
          <el-button icon="More" text type="primary"
            @click="gotoDetailPatientCase(scope.row)">查看详情</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
  </div>
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue';
import { BasicTableProps, useTable } from "/@/hooks/table";
import { getPatientCaseList } from '/@/api/patient/patientBase';

const props = defineProps<{
  patientUid: string
}>()

// 基于类型
const emit = defineEmits<{
  (e: 'changeShowPatientCaseDetail', tmp: boolean): void
  (e: 'changePatientCaseObj' , tmp: any): void
}>()

const state: BasicTableProps = reactive<BasicTableProps>({
  queryForm: {},
  pageList:getPatientCaseList
})

// 设置预置搜索条件
state.queryForm.patientUid = props.patientUid || null

const {
  getDataList,
  currentChangeHandle,
  sizeChangeHandle,
  sortChangeHandle,
  downBlobFile,
  tableStyle
} = useTable(state)


// 查看详情
const gotoDetailPatientCase = (patientCaseObj: any) => {
  // 调用父组件方法，展示详情
  emit('changeShowPatientCaseDetail', true);
  // 调用父组件方法，传递病例详情
  emit('changePatientCaseObj', patientCaseObj);
}

</script>